<template>
  <div class="layui-container">
            <div class="layui-row layui-col-space15">
                <!-- 左边主体部分 -->
                <div class="layui-col-md8">
                    <div class="fly-panel" style="margin-bottom: 0;">

                        <div class="fly-panel-title fly-filter">
                            <a href="/post/list/all?page=1" class="layui-this">综合</a>
                            <span class="fly-mid"></span>
                            <a href="/post/list/all?page=1&status=1">未结</a>
                            <span class="fly-mid"></span>
                            <a href="/post/list/all?page=1&status=2">已结</a>
                            <span class="fly-mid"></span>
                            <a href="/post/list/all?page=1&status=3">精华</a>
                            <span class="fly-filter-right layui-hide-xs"><a href="" class="layui-this">按最新</a><span class="fly-mid"></span><a href="">按热议</a></span>
                        </div>

                        <ul class="fly-list">
                            <li v-for="(item) in postlist.rows" :key="item.ID">
                                <a href="{:url('user/index/home',array('id'=>$v.author))}" class="fly-avatar">
                                    <img :src="item.user_info.head_img" :alt="item.user_info.author_name">
                                </a>
                                <h2>
                                    <a class="layui-badge">{{item.category_name}}</a>
                                    <a :href="'/post/'+item.id">{{item.title}}</a>
                                </h2>
                                <div class="fly-list-info">
                                    <a href="{:url('user/index/home',array('id'=>$v.author))}" link>
                                        <cite>{{item.user_info.author_name}}</cite>
                                        <i v-if="item.user_info.is_admin === '1'" class="iconfont icon-renzheng" title="认证信息：管理员"></i>
                                        <i v-if="item.user_info.is_vip === '1'" class="layui-badge fly-badge-vip">VIP{{item.user_info.is_vip}}</i>
                                    </a>
                                    <span>{{item.create_date}}</span>

                                    <span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> {{item.reward}}</span>
                                    <span  v-if="item.solved === '1'" class="layui-badge fly-badge-accept layui-hide-xs">已结</span>
                                    <span class="fly-list-nums"><i class="iconfont icon-pinglun1" title="回答"></i> {{item.comment_count}}</span>
                                </div>
                                <div class="fly-list-badge">
                                    <span  v-if="item.is_wonderful === '1'" class="layui-badge layui-bg-red">精帖</span>
                                </div>
                            </li>  
                        </ul>
        
                        <div  v-if="postlist.count > 0" style="text-align: center">
                            <div class="laypage-main">
                                <span v-if="paging.Page === 1"  style="cursor: not-allowed;color:#777;">«</span>
                                <a v-else :href="'?page='+data.prev+'&pageSize='+paging.Pagesize" class="not">«</a>
                                <template v-for="item in paging.Nums" :key="item">
                                  <a v-if="item != paging.Page" :href="'?page='+item+'&pageSize='+paging.Pagesize" class="active">{{item}}</a>
                                  <span v-else class="laypage-curr">{{paging.Page}}</span>
                                </template>
                                <span v-if="paging.Page === paging.PageCount" style="cursor: not-allowed;color:#777;">»</span>
                                <a v-else :href="'?page='+data.next+'&pageSize='+paging.Pagesize">»</a>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 左边主体部分 -->
                <Right />
            </div>
        </div>
</template>

<script>
import Right from '../components/Right.vue'
import request from '@/utils/request'
export default {
   components: {
    Right,
  },
  data() {
    return {
      data: {}, //结果data
      postlist: [], // 帖子列表
      paging: [], //帖子分页
    };
  },
  mounted(){
    console.log(this.$route)
    console.log("cate:",this.$route.params.cate)
    console.log("page:",this.$route.query.page)
    this.getCateData(this.$route.params.cate,this.$route.query.page) //获取帖子分类列表
  },
  inject:['store'],
  setup(){
    console.log("setup start")
    myFn()
    function myFn(){
      console.log("aaa");
    }
    return {
      myFn
    }
  },
  methods: {
    //获取帖子分类列表
    getCateData(cate,page) {
      const params = {
        params: {
          page: page,
        }
      }
      request.get('/micro-bbs/v1/post/list/'+cate, params).then((res) => {
        const { code, data } = res
        // this.notifySucceed(message);
        if (code === 200) {
          this.data = data
          this.postlist = data.data
          this.paging = data.paging
        }
      })
    },

  }
}
</script>